
<div id="assessments-results-warning" style="display: none;">Student has not completed an assessment for: </div>
    <div id="assessment-table" style="display: none;">
        <table id="custom-assessments" class="tablesorter" >
            <thead>
                <tr>
                    <th style="width: 25%;">Assessment</th>
                    <th style="width: 30%;">Date and Time</th>
                    <th style="width: 15%;">Details</th>
                </tr>
            </thead>
            <tbody id="custom-assessments-body"></tbody>
            {% for assessment in CUSTOM_ASSESSMENTS %}
            <script>
                $.getJSON(base_url + 'assessment/{{ assessment.application_name }}/get/results/{{ student.id }}',
                    function( data ){
                        if( data == ""){
                            $('#assessments-results-warning').append('<span style="font-weight: bold; margin-right: 7px;">{{ assessment.application_name }} </span>');
                            $('#assessments-results-warning').show('fast');
                        }else{
                            $.each(data, function(key, val){
                                row = eval(val);
                                $('#custom-assessments-body').append('<tr><td>{{ assessment.application_name }}</td><td>' + row.date_taken + '</td><td><a id="custom-assessment-link_{{ assessment.application_name }}_' + row.id + '" ref="'+row.id+'" href="javascript:;">Details</a></td></tr>');

                                $('#custom-assessment-link_{{ assessment.application_name }}_' + row.id).click(function() {
                                    var result_id = $(this).attr('ref');
                                    if($('#custom-assessment-details').is(":visible")){
                                        $('#custom-assessment-details').hide('fast');
                                    }
                                    $('#details_window').load(base_url + 'assessment/{{ assessment.application_name }}/get/result/'+ result_id+'/', function(){
                                        $('#custom-assessment-details').show('fast');
                                    });
                                });
                            });
                            $("#custom-assessments").tablesorter({
                                sortList: [[1,1]],
                                headers: {0: { sorter: false }, 2: { sorter: false }}
                            });
                            $('#assessment-table').show('fast');
                        }
                    });
                    styleTable();
                </script>
            {% endfor %}
        </table>
        <div id="custom-assessment-details" style="display: none;">
            <div id="details_label">
                <h4>Detailed Results</h4>
                <hr />
            </div>
            <div id="details_window" class="window"></div>
        </div>
    </div>